
import { Component, OnInit, Input, ComponentFactoryResolver, ViewChild } from '@angular/core';
import { DynamicAnchorsDirective } from '../../../common/directive/dynamic-anchors.directive'
import { TaskListService } from '../tasklist.service';
import { TASK_LIST_DETAIL_TAB, TabComponent } from './tab-details';

@Component({
    selector: 'tasklist-tab',
    templateUrl: './tasklist-tab.component.html',
    styleUrls: ['./tasklist-tab.component.scss'],
    providers: [TaskListService]
})
export class TaskListTabComponent implements OnInit {
    @Input()
    selectedRecord: any;
    @ViewChild(DynamicAnchorsDirective, { static: true }) archorHost: DynamicAnchorsDirective;

    details: any = TASK_LIST_DETAIL_TAB;
    tabs: any = [];
    constructor(
        private taskListService: TaskListService,
        private componentFactoryResolver: ComponentFactoryResolver
    ) { }

    ngOnInit() {
    }

    loadTaskListTab(taskListId, actDefId, systemUrl) {
        this.taskListService.loadTaskListTab(taskListId, actDefId, systemUrl).subscribe(tabs => {
            this.tabs = tabs;
        });
    }

    /** Tab切换 */
    onDetailTabChange(event) {
        $('.tab-container-header').height(event.index >= 1 ? '40px' : 'calc(100% - 40px)');
        if (event.index >= 1) {
            let componentName = this.tabs[event.index - 1].component;
            let componentFactory = this.componentFactoryResolver.resolveComponentFactory(TASK_LIST_DETAIL_TAB[componentName]);
            let viewContainerRef = this.archorHost.viewContainerRef;
            viewContainerRef.clear();
            let componentRef = viewContainerRef.createComponent(componentFactory);
            (<TabComponent>componentRef.instance).data = {
                'recId': this.selectedRecord['rec_id'],
                'actId': this.selectedRecord['act_id'],
                'actDefId': this.selectedRecord['act_def_id'],
                'bizId': this.selectedRecord['biz_id']
            };
        }
    }
}